%div
  %label.label-bold.gl-mb-0
    = s_('Profiles|Connected Accounts')
  %p.gl-text-subtle= s_('Profiles|Select a service to sign in with.')
  .gl-flex.gl-flex-wrap.gl-gap-3
    - providers.each do |provider|
      - unlink_allowed = unlink_provider_allowed?(provider)
      - link_allowed = link_provider_allowed?(provider)
      - has_icon = provider_has_icon?(provider)
      - if unlink_allowed || link_allowed
        - if auth_active?(provider)
          - if unlink_allowed
            - button_text = s_('Profiles|Disconnect %{provider}') % { provider: label_for_provider(provider) }
            = render Pajamas::ButtonComponent.new(href: unlink_profile_account_path(provider: provider),
              method: :delete,
              button_options: { 'aria-label': button_text }) do |c|
              - if has_icon
                - c.with_icon_content do
                  .social-provider-btn-image.gl-button-icon= provider_image_tag(provider)
              = button_text
          - else
            - button_text = s_('Profiles|%{provider} Active') % { provider: label_for_provider(provider) }
            = render Pajamas::ButtonComponent.new(button_options: { 'aria-label': button_text }) do
              = button_text
        - elsif link_allowed
          - button_text = s_('Profiles|Connect %{provider}') % { provider: label_for_provider(provider) }
          = render Pajamas::ButtonComponent.new(href: omniauth_authorize_path(:user, provider),
            method: :post,
            button_options: { 'aria-label': button_text }) do |c|
            - if has_icon
              - c.with_icon_content do
                .social-provider-btn-image.gl-button-icon= provider_image_tag(provider)
            = button_text
    = render_if_exists 'profiles/accounts/group_saml_unlink_buttons', group_saml_identities: group_saml_identities
